{extend name="common/layout"}

{block name="main"}
<form class="layui-form" action="">

    <div class="layui-card">
        <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
            <ul class="layui-tab-title">
                <li class="layui-this">网站设置</li>
                <li>上传配置</li>
            </ul>
            <div class="layui-tab-content" style="height: 100px;">
                <div class="layui-tab-item layui-show">
                    <div class="layui-form-item">
                        <label class="layui-form-label">网站标题</label>
                        <div class="layui-input-block">
                            <input type="text" name="site_config[title]" value="{$site_config.title}" lay-verify="title"
                                autocomplete="off" placeholder="请输入网站标题" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">网站描述</label>
                        <div class="layui-input-block">
                            <input type="text" name="site_config[desc]" value="{$site_config.desc}" autocomplete="off"
                                placeholder="请输入网站描述" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">网站LOGO</label>
                        <div class="layui-input-block">

                            <input type="hidden" id="image" name="site_config[logo]" value="{$site_config.logo}" />
                            <div class="layui-upload">
                                <button type="button" class="layui-btn" id="uploadimg">上传图片</button>
                                <div class="layui-upload-list">
                                    <img class="layui-upload-img" {if condition="$site_config.logo != ''" }
                                        src="{$site_config.logo}" {/if} id="preview" style="width: 100px;height:100px;">
                                    <p id="demoText"></p>
                                </div>
                                <div style="width: 95px;">
                                    <div class="layui-progress layui-progress-big" lay-showpercent="yes"
                                        lay-filter="progress">
                                        <div class="layui-progress-bar" lay-percent=""></div>
                                    </div>
                                </div>
                            </div>

                            <a name="list-progress"> </a>

                        </div>
                    </div>


                </div>
                <div class="layui-tab-item">

                    <div class="layui-form-item">
                        <label class="layui-form-label">存储位置</label>
                        <div class="layui-input-block">
                            <input type="radio" lay-filter="radiotype" name="upload_config[type]" value="0" title="本地"
                                {if condition="$upload_config['type'] eq '0' or $upload_config['type'] eq '' " }
                                checked="" {/if}>
                            <input type="radio" lay-filter="radiotype" name="upload_config[type]" value="1" title="阿里云"
                                {if condition="$upload_config['type'] eq '1'" } checked="" {/if}>
                            <input type="radio" lay-filter="radiotype" name="upload_config[type]" value="2" title="七牛云"
                                {if condition="$upload_config['type'] eq '2'" } checked="" {/if}>
                            <input type="radio" lay-filter="radiotype" name="upload_config[type]" value="3" title="腾讯云"
                                {if condition="$upload_config['type'] eq '3'" } checked="" {/if}>
                        </div>
                        <div class="layui-form-mid layui-word-aux">选择阿里云/七牛云需要修改配置文件/config/plugin/tinywan/storage</div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">允许的文件后缀</label>
                        <div class="layui-input-block">
                            <input type="text" name="upload_config[extensions]" value="{$upload_config.extensions}"
                                autocomplete="off" placeholder="例如:png,jpg,mp4" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">允许的文件大小(MB)</label>
                        <div class="layui-input-block">
                            <input type="number" name="upload_config[maxsize]" value="{$upload_config.maxsize}"
                                autocomplete="off" placeholder="例如:10" class="layui-input">
                        </div>
                        <div class="layui-form-mid layui-word-aux">请注意不要超过服务器设置的最大上传限制(config/server.php,
                            max_package_size)</div>
                    </div>

                </div>
            </div>
        </div>


        <div class="layui-form-item" style="padding: 200px 30px 30px 30px;">

            <button type="submit" class="pear-btn pear-btn-primary " lay-submit="" lay-filter="save">
                <i class="layui-icon layui-icon-ok"></i>
                保存
            </button>

        </div>



    </div>

</form>
{/block}

{block name="footer_script"}
<script>
    layui.use(['form', 'jquery', 'common', 'upload', 'element'], function () {
        let form = layui.form;
        let $ = layui.jquery;
        let common = layui.common;
        let upload = layui.upload;
        let element = layui.element;

        var uploadInst = upload.render({
            elem: '#uploadimg'
            , url: '/admin/index/upload' //此处用的是第三方的 http 请求演示，实际使用时改成您自己的上传接口即可。
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#preview').attr('src', result); //图片链接（base64）
                });

                element.progress('progress', '0%'); //进度条复位
                layer.msg('上传中', { icon: 16, time: 0 });
            }
            , done: function (res) {
                console.log(res);
                //如果上传失败
                if (res.code == 0) {
                    return layer.msg('上传失败');
                }

                $("#image").val(res.data[0].url);
            }
            , error: function () {
                //演示失败状态，并实现重传
                return layer.msg('上传失败');
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function () {
                    uploadInst.upload();
                });
            }
            //进度条
            , progress: function (n, elem, e) {
                element.progress('progress', n + '%'); //可配合 layui 进度条元素使用
                if (n == 100) {
                    layer.msg('上传完毕', { icon: 1 });
                }
            }
        });


        form.on('submit(save)', function (data) {
            $.ajax({
                url: '/admin/system/setting',
                data: data.field,
                dataType: 'json',
                //contentType: 'application/json',
                type: 'post',
                success: function (result) {
                    if (result.code == 1) {
                        layer.msg(result.msg, {
                            icon: 1,
                            time: 1000
                        }, function () {
                            parent.layui.admin.refreshThis();
                        });
                    } else {
                        layer.msg(result.msg, {
                            icon: 2,
                            time: 1000
                        });
                    }
                }
            })
            return false;
        });


    })
</script>
{/block}